@font-face {
    font-family: 'icomoon';
    src:  url('fonts/icomoon.eot?3o9bbx');
    src:  url('fonts/icomoon.eot?3o9bbx#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?3o9bbx') format('truetype'),
    url('fonts/icomoon.woff?3o9bbx') format('woff'),
    url('fonts/icomoon.svg?3o9bbx#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}
body, ul,div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    margin: 0;
    padding: 0;
}
.header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
a {
    text-decoration: none;
    color: #000;
}
.header a {
    display: block;
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    color: #000;
}
.icon1::before {
    font-family: 'icomoon';
    content: '\e919';
    font-size: 22px;
}
.header .register {
    color: #099fde;
}
/* 登录模块 */
.main {
    margin-top: 50px;
    margin: 0 20px;
}
.main h1 {
    font-weight: normal;
    text-align: center;
    font-size: 24px;
    margin: 50px 0;
}
.main .login {
    display: flex;
    position: relative;
    height: 162px;
    flex-direction: column;
}
.main .login input {
    flex: 1;
    border: 0;
    outline: none;
    border-bottom: 1px solid #cccccc;
}
.main .login i {
    position: absolute;
    bottom: 20px;
    right: 0;
    font-size: 12px;
    font-style: normal;
}
.main .login i a {
    color: #099fde;
}
.main .login span::before {
    font-family: 'icomoon';
    position: absolute;
    content: '\e914';
    top: 15px;
    right: 0;   
    font-size: 25px;
    color: #cccccc;
}
.footer {
    margin-top: 30px;
}
.footer button {
    display: block;
    border: none;
    height: 44px;
    width: 100%;
    background: #ff9a14;
    outline: none;
    color: #fff;
    line-height: 44px;
    text-align: center;
    border-radius: 5px;
}
.footer ul {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}
.footer ul li {
    list-style: none;
}
.footer ul li a {
    color: #757575;
    font-size: 14px ;
}
.buttom {
    width: 100%;
    height: 119px;
    margin-top: 50px;
}
.buttom ul {
    display: flex;
    height: 45px;
}
.buttom ul li {
    position: relative;
    flex: 1;
    list-style: none;
    display: flex;
    justify-content: center; 
    overflow: hidden;   
}
.buttom ul li a {
    display: inline-block;
    width: 39px;
    height: 39px;
    border-radius: 39px;
    border: 1px solid #099fde;
}
.buttom ul li a::before {
    position: absolute;
    content: "";
    display: inline-block;
    left: 50%;
    top: 50%;
    width: 23px;
    height: 20px;
    background: url(../upload/3.png) 0 -20px no-repeat;
    background-size: 23px auto;
    transform: translateX(-50%) translateY(-50%); 
}
.buttom ul li .middle::before {
    background-position: 0 -40px;
}
.buttom ul li .last::before {
    background-position: 0 -60px;
}
.buttom ul li .middle {
    border-color: blue;
}
.buttom ul li .last {
    border-color: #fbbbba;
}
.buttom p {
    text-align: center;
    font-size: 12px;
    margin-top: 20px;
    color: #757575;
}
.buttom p a {
    color: #099fde;
}